<template>
	<view style="">
		<u-navbar leftIconColor="#000000" :titleStyle="{ color: '#000000' }" :bgColor="bgColor" title="我的信息设置"
			:placeholder="true" :autoBack="true"></u-navbar>
		<view class="note">

		</view>
		<view class="" style="width: 92%;margin: 0 auto;padding-top:15px;position: relative;z-index: 1;">
			<view class="top flex" style="margin-bottom: 15px;padding: 0 15px;">
				<view class="flex" style="justify-content: space-between;width: 100%;">
					<view class="flex">
						<image style="width: 51px;height: 51px;border-radius: 50%;" :src="info.avatar" mode=""></image>
						<view class="flex" style="flex-direction: column;align-items: flex-start;padding-left: 10px;">
							<text style="font-size: 15px;font-weight: 400;color: #FFFFFF;">{{info.username}}</text>
							<text
								style="font-size: 14px;font-weight: 400;color: #FFFFFF;padding-top: 10px;">{{info.mobile}}</text>
						</view>
					</view>
					<u-icon @click="nav(2)" name="arrow-right" color="#fff" size="16"></u-icon>
				</view>
			</view>
			<view class="" style="padding-bottom: 15px;">
				<text style="font-size: 15px;font-weight: 400;color: #333333;">账户安全</text>
			</view>
			<view style="padding: 0px 15px; background-color: #fff; border-radius: 10px">
				<view class="flex" @click="nav(1)"
					style="justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #f3f3f3">
					<view style="color: #1d1f20; font-size: 14px; font-weight: 400">实名认证</view>
					<view class="flex">
						<view style="font-size: 14px; color: #ff3331; margin-right: 13px">{{ info.authentication_text }}
						</view>
						<u-icon name="arrow-right" color="#1D1F20" size="18"></u-icon>
					</view>
				</view>
				<!-- <view class="flex" @click="nav(2)"
					style="justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #f3f3f3">
					<view style="color: #1d1f20; font-size: 14px; font-weight: 400">修改个人信息</view>
					<view class="flex">
						<view style="margin-right: 13px; font-size: 14px; color: #1d1f20">修改个人信息</view>
						<u-icon name="arrow-right" color="#1D1F20" size="18"></u-icon>
					</view>
				</view> -->
				<view class="flex" @click="nav(3)" style="justify-content: space-between; padding: 15px 0">
					<view style="color: #1d1f20; font-size: 14px; font-weight: 400">修改密码</view>
					<view class="flex">
						<view style="margin-right: 13px; font-size: 14px; color: #1d1f20">修改密码</view>
						<u-icon name="arrow-right" color="#1D1F20" size="18"></u-icon>
					</view>
				</view>
			</view>
			<view class="" style="padding-bottom: 15px;margin-top: 15px">
				<text style="font-size: 15px;font-weight: 400;color: #333333;">工具设置</text>
			</view>
			<view style="padding: 0px 15px; background-color: #fff; border-radius: 10px; ">
				<!-- <view class="flex" @click="nav(4)"
					style="justify-content: space-between;padding: 15px 0;border-bottom: 1px solid #F3F3F3;">
					<view style="color: #1D1F20;font-size: 14px;font-weight: 400;">联系客服</view>
					<u-icon name="arrow-right" color="#1D1F20" size="18"></u-icon>
				</view> -->
				<!-- 	<view
					class="flex"
					@click="nav(5)"
					style="justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #f3f3f3"
				>
					<view style="color: #1d1f20; font-size: 14px; font-weight: 400">关注公众号</view>
					<u-icon name="arrow-right" color="#1D1F20" size="18"></u-icon>
				</view> -->
				<view class="flex" @click="nav(6)"
					style="justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #f3f3f3">
					<view style="color: #1d1f20; font-size: 14px; font-weight: 400">用户协议</view>
					<u-icon name="arrow-right" color="#1D1F20" size="18"></u-icon>
				</view>
				<view class="flex" @click="nav(7)" style="justify-content: space-between; padding: 15px 0">
					<view style="color: #1d1f20; font-size: 14px; font-weight: 400">隐私政策</view>
					<u-icon name="arrow-right" color="#1D1F20" size="18"></u-icon>
				</view>
			</view>
			<view style="margin-top: 30px">
				<u-button @click="logout" shape="circle" color="#2447FF" type="primary" text="退出登录"></u-button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: '',
				bgColor: 'rgba(255,255,255,0)',
			};
		},
		onPageScroll(e) {
			if (e.scrollTop > 50) {
				this.bgColor = 'rgba(255,255,255,1)'
			} else {
				this.bgColor = 'rgba(255,255,255,0)'
			}
		},
		onShow() {
			this.showUserInfo();
		},
		methods: {
			logout() {
				uni.removeStorageSync('token')
				this.$tips('退出成功')
				setTimeout(()=>{
					uni.navigateTo({
						url:'/pages/login/smslogin'
					})
				},1000)
			},
			async showUserInfo() {
				let res = await this.$http.index.showUserInfo({});
				if (res.code == 1) {
					this.info = res.data;
				}
			},
			nav(i) {
				switch (i) {
					case 1:
						if (this.info.authentication == 1) {
							// uni.navigateTo({
							// 	url: '/pages/me/real_name?id=1',
							// });
							uni.navigateTo({
								url:'/pages/me/userinfo'
							})
						} else {
							uni.navigateTo({
								url: '/pages/me/real_name',
							});
						}

						break;
					case 2:
						uni.navigateTo({
							url: '/pages/me/edit_personal',
						});
						break;
					case 3:
						uni.navigateTo({
							url: '/pages/me/resetting',
						});
						break;
					case 5:
						uni.navigateTo({
							url: '/pages/home/follow',
						});
						break;

					case 6:
						uni.navigateTo({
							url: '/pages/me/agreement',
						});
						break;
					case 7:
						uni.navigateTo({
							url: '/pages/me/privacy',
						});
						break;
				}
			},
		},
	};
</script>
<style scoped lang="less">
	/deep/ .u-button--primary {
		background-color: #fff;
		border-color: #fff;
	}

	.note {
		background-image: url('@/static/font/21.png');
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		background-size: 100% 100%;
	}

	.top {
		background-image: url('@/static/font/30.png');
		height: 100px;
		background-size: 100% 100%;
	}

	.flex {
		display: flex;
		align-items: center;
	}
</style>
<style>
	page {
		background-color: #f7f9fa;
	}
</style>